function createGeneralTab(){
	hf.data.GeneralStore = Ext.extend(Ext.data.GroupingStore, {
		constructor: function(config) {
			Ext.apply(this, {
				reader: new Ext.data.JsonReader({
		    	  	totalProperty: TOTAL_PROPERTY, 
		    	  	successProperty: SUCCSESS_PROPERTY,
		    	  	idProperty: indexes['id'], 
		    	  	root: ROOT, 
		    	  	messageProperty: MESSAGE_PROPERTY
		      	},config.columnArray),
		        autoLoad: false,
		        groupField: indexes['year'],
		        sortInfo: {field: indexes['id'], direction: 'asc'}
		        
		  });
		  hf.data.GeneralStore.superclass.constructor.apply(this, arguments);
	   }	
    });
	Ext.reg('general-store', hf.data.GeneralStore);
	
	//define column for general grid
	hf.widget.column.TotalColumn = Ext.extend(Ext.grid.NumberColumn, {
		constructor: function(config) {
			Ext.apply(this, {
				summaryType: 'sum', 
				format: '0.00', 
				summaryRenderer: function(value, summaryData, dataIndex) {
					return Ext.util.Format.number(value, '0.00');
				}
        	});
        	hf.widget.column.TotalColumn.superclass.constructor.apply(this, arguments);	
		}
	});
	Ext.grid.Column.types['total-column'] = hf.widget.column.TotalColumn;
	
	hf.widget.TotalGrid = Ext.extend(Ext.grid.GridPanel, {
		constructor: function(config) {
			Ext.apply(this, {
				anchor: '100% 100%',
         		selModel: new Ext.grid.RowSelectionModel({
         			singleSelect: true
         		}),
         		view: new Ext.grid.GroupingView({
         			forceFit: true,
         			showGroupName: true,
         			enableNoGroups: false,
         			hideGroupedColumn: false
         		}),
         		plugins: new Ext.grid.GroupSummary(),
	       		frame: true,
	       		columnLines: true,
	       		stripeRows: true,
	       		tbar: [
	       			{xtype: 'form-button', ref: '../showAllButton', iconCls: 'icon-show-all', 
	       				text: labels['button.title.showall'], buttonEvent: 'showAll', tooltip: qtips['qtips.button.showall']},
	       			{xtype: 'tbseparator'},
	       			{xtype: 'tbspacer', width: 3},
	       			{xtype: 'tbtext', text: labels['label.year']},
	       			{xtype: 'tbspacer', width: 3},
	       			{xtype: 'year-combo', ref: '../yearCombo', value: '-'},
	       			{xtype: 'tbspacer', width: 10},
	       			{xtype: 'tbtext', text: labels['label.month']},
	       			{xtype: 'tbspacer', width: 3},
	       			{xtype: 'month-combo', ref: '../monthCombo', value: '-'},
	       			{xtype: 'tbseparator'}]
		    });
		    hf.widget.TotalGrid.superclass.constructor.apply(this, arguments);
		    
		    this.on('select', function(field, newValue, oldValue){
		    	this.loadData();
		    });
		    
		    this.on('showAll', function(button, event){
		    	this.yearCombo.setValue('-');
		    	this.monthCombo.setValue('-');
		    	this.loadData();
		    });
		    
		    this.relayEvents(this.showAllButton, ['showAll']);
		    this.relayEvents(this.yearCombo, ['select']);
		    this.relayEvents(this.monthCombo, ['select']);
	    },
	    
		loadData: function(){
			var year = this.yearCombo.getValue();
			if(year == '' || year == '-'){
				year = FAKE_ID; 
				this.yearCombo.setValue('-');
			}
			var month = this.monthCombo.getValue();
			if(month == '' || month == '-'){
				month = FAKE_ID; 
				this.monthCombo.setValue('-');
			}
			this.getStore().load({params: {year: year, month: month}});
		}
	});
	Ext.reg('total-grid', hf.widget.TotalGrid);
	
	//create grid with total information and grouping by year
	var grid = {
		xtype: 'total-grid',
		ref: 'totalGrid',
		store: {
			xtype: 'general-store',
			url: 'general/view.action',
			columnArray: [
	         	{name: indexes['id'], type: INTEGER}, 
	         	{name: indexes['year'], type: INTEGER},
	         	{name: indexes['month'],  type: INTEGER},
	         	{name: 'summaRent',  type: FLOAT},
	         	{name: 'summaElectricity',  type: FLOAT},
	         	{name: 'summaColdWater',  type: FLOAT},
	         	{name: 'summaHotWater',  type: FLOAT},
	         	{name: 'summaGas',  type: FLOAT},
	         	{name: 'summaHeating',  type: FLOAT},
	         	{name: 'summaPhone',  type: FLOAT},
	         	{name: 'summaIntercom',  type: FLOAT},
	         	{name: 'summaInternet',  type: FLOAT},
	         	{name: 'summaTv',  type: FLOAT},
	         	{name: 'summaTotal',  type: FLOAT}
	      	]
		},
   		colModel: new Ext.grid.ColumnModel({
       		defaults: {width: 50, sortable: true, hideable: true, groupable: false},
        	columns: [new Ext.grid.RowNumberer({header: '№'}),	
       			{xtype: 'gridcolumn', id: indexes['year'], dataIndex: indexes['year'], header: labels['label.year'], tooltip: qtips['qtips.column.year'], 
       			groupable: true, summaryType: 'max', summaryRenderer: function(value, summaryData, dataIndex) {return value;}},
       			{xtype: 'gridcolumn', id: indexes['month'], dataIndex: indexes['month'], header: labels['label.month'], tooltip: qtips['qtips.column.month'],
       				renderer: function(val, x, rec){return months[val][1];}, summaryType: 'max', summaryRenderer: function(value, summaryData, dataIndex) {return 'Итого:';}}, 				
       			{xtype: 'total-column', id: 'summaRent', dataIndex: 'summaRent', header: labels['label.column.rent'], tooltip: qtips['qtips.column.rent']},
       			{xtype: 'total-column', id: 'summaElectricity', dataIndex: 'summaElectricity', header: labels['label.column.electricity'], tooltip: qtips['qtips.column.electricity']},
       			{xtype: 'total-column', id: 'summaColdWater', dataIndex: 'summaColdWater', header: labels['label.column.coldwater'], tooltip: qtips['qtips.column.coldwater']},      
       			{xtype: 'total-column', id: 'summaHotWater', dataIndex: 'summaHotWater', header: labels['label.column.hotwater'], tooltip: qtips['qtips.column.hotwater']},
       			{xtype: 'total-column', id: 'summaGas', dataIndex: 'summaGas', header: labels['label.column.gas'], tooltip: qtips['qtips.column.gas']},
       			{xtype: 'total-column', id: 'summaHeating', dataIndex: 'summaHeating', header: labels['label.column.heating'], tooltip: qtips['qtips.column.heating']},
       			{xtype: 'total-column', id: 'summaPhone', dataIndex: 'summaPhone', header: labels['label.column.phone'], tooltip: qtips['qtips.column.phone']},
       			{xtype: 'total-column', id: 'summaIntercom', dataIndex: 'summaIntercom', header: labels['label.column.intercom'], tooltip: qtips['qtips.column.intercom']},
       			{xtype: 'total-column', id: 'summaInternet', dataIndex: 'summaInternet', header: labels['label.column.internet'], tooltip: qtips['qtips.column.internet']},
       			{xtype: 'total-column', id: 'summaTv', dataIndex: 'summaTv', header: labels['label.column.tv'], tooltip: qtips['qtips.column.tv']},
				{xtype: 'total-column', id: 'summaTotal', dataIndex: 'summaTotal', header: '<b>'+labels['label.column.total']+'</b>', tooltip: qtips['qtips.column.total'], renderer: function(val, x, rec){return '<b>'+val+'</b>';}}
       		]
 		}),
 		autoExpandColumn: 'summaTotal'
	};
	
	var tab = {
		xtype: 'panel',
		layout: 'anchor',
		title: labels['label.general.tab.title'], 
		items: [grid],
		listeners: {
			'activate':{
		        fn: function(tab){
		        	tab.totalGrid.loadData();
		        }
		    }
		}
		
	};
	return tab;
};